[iOS 10] Today Extension の新機能「Expanded Mode」について

iOS 10

#iOS

#iPhone

平屋真吾

2016.11.08

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

はじめに

こんにちは。モバイルアプリサービス部の平屋です。

本記事では iOS 10 で Today Extension に追加された新機能「Expanded Mode」を有効にする手順をご紹介します。

Today Extension 作成

早速実装の解説に入ります。

まずは既存の Xcode プロジェクトに Today Extension を追加します。追加の手順についてはこちらの記事などを参考にしてみてください!

Today Extension 追加してそのまま Extension を起動してみると、以下のようなウィジェットが表示されます。高さは固定です。

Today Extension を Expanded Mode に対応させる

Today Extension 追加時に生成された ViewController を編集していきます。

Expanded Mode を有効にする

任意のタイミングで、NSExtensionContext の widgetLargestAvailableDisplayMode プロパティ (iOS 10 で新規追加) に .expanded を指定します。これで Expanded Mode が有効になります。

class TodayViewController: UIViewController, NCWidgetProviding {

    override func viewDidLoad() {
        super.viewDidLoad()

        // 追加
        self.extensionContext?.widgetLargestAvailableDisplayMode = .expanded
    }

    // ...
}

display mode が変更された時の処理を追加する

Expanded Mode を有効にすると、ウィジェットの上部に「表示を増やす」ボタンが表示され、ウィジェットの display mode (compact または expanded) を切り替えることができるようになります。

この切替のタイミングをハンドリングするには NCWidgetProviding プロトコルで定義されている widgetActiveDisplayModeDidChange(_:withMaximumSize:) メソッド (iOS 10 で新規追加) を実装します。

display mode は activeDisplayMode 引数から判断できます。

設定可能なウィジェットの最大サイズは maxSize 引数に入っています。 display mode が expanded の場合、UIViewController の preferredContentSize プロパティに値を指定することによって、ウィジェットのサイズを変更できます。

class TodayViewController: UIViewController, NCWidgetProviding {

    // ...

    // 追加
    func widgetActiveDisplayModeDidChange(_ activeDisplayMode: NCWidgetDisplayMode,
                                          withMaximumSize maxSize: CGSize) {
        if (activeDisplayMode == .compact) {
            self.preferredContentSize = maxSize;
        } else {
            self.preferredContentSize = CGSize(width: 0, height: 170);
        }
    }
}